import React, { useEffect } from 'react'
import '../../../api/index'
import axios from '../../../axioslist/index'
//要加 .d
import { ALLTYPELIST, CHILDRENDATALIST, ADD_LIST_DATA_TYPE } from '../../../types/index.d'
import { useLocation, useNavigate } from 'react-router-dom'
import { useSelector } from 'react-redux'
import { ProductCard, Tag, Button } from 'react-vant';
import { Toast, NavBar } from 'react-vant';
import { CartO, ChatO, ShopO } from '@react-vant/icons';
import { ActionBar } from 'react-vant';
import { useDispatch } from 'react-redux'



export default function Shopcar() {
  const listdata = useSelector((state: ALLTYPELIST) => {
    return state.listpush
  })
  useEffect(() => {
    console.log(listdata, 'listdata这个添加的数据');

  }, [listdata])
  const navigate = useNavigate()
  const dispatch = useDispatch()

  //++   不能传index因为index是下标   item是数据本身所用item
  const add_shop_car = (item: CHILDRENDATALIST) => {
    console.log(item, '1111');
    dispatch({
      type: ADD_LIST_DATA_TYPE,
      payload: item
    })
  }

  //-- 购物车减减
  const del_shop_carlist = (item:CHILDRENDATALIST) => {
    console.log(item, '11111');

  }

  return (
    <div>
      <NavBar
        title="标题"
        leftText="返回"

        onClickLeft={() => navigate(-1)}

      />
      {
        listdata.map((item, index) => {
          return <ProductCard
            key={index}
            num={item.num}
            price={item.price}
            desc={item.state1}
            title={item.user}
            thumb={item.img}
            footer={
              <>
                <Button size="mini" round plain onClick={() => add_shop_car(item)}>
                  ++
                </Button>
                <Button size="mini" round plain onClick={() => del_shop_carlist(item)}>
                  --
                </Button>
              </>
            }
          />
        })


      }



    </div>
  )
}
